<template>
  <div v-loading="loading">
    <industry-credit
      :oneIndustry="oneIndustry"
      v-if="+isHistory === 1 || +guaType === 3"
      :relatedId="queryId"
      :guaType="guaType"
    ></industry-credit>
    <credit-index v-else :queryId="queryId" :viewMode="viewMode"></credit-index>
  </div>
</template>
<script>
import CreditIndex from '@/credit/components/creditFile/CreditIndex'
import IndustryCredit from '@/bank/components/IndustryCredit'
export default {
  components: {
    CreditIndex,
    IndustryCredit,
  },
  props: {
    queryId: {
      type: String,
      default: '',
    },
    viewMode: {
      type: Boolean,
      default: false,
    },
    oneIndustry: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      tableName: 'customer_related',
      loading: false,
      isHistory: 1,
      guaType: '',
    }
  },
  watch: {
    queryId: {
      handler: function () {
        this.getData()
      },
      immediate: true,
    },
  },
  methods: {
    getData() {
      if (!this.queryId) {
        return
      }
      this.loading = true
      this.$api
        .getData(this.$serviceName, this.tableName, { 'customer_related_id.eq': this.queryId })
        .then(res => {
          const data = (res && res.data && res.data[0]) || {}
          this.guaType = data.gua_type
          this.isHistory = data.is_history
        })
        .finally(() => {
          this.loading = false
        })
    },
  },
}
</script>

<style lang="scss" scoped></style>
